<template>
  <div class="STinformation">
    <!-- --头像-- -->
    <div class="demo-type">
    <div>
      <el-avatar :src="imgUrl"></el-avatar>
    </div>
  </div>
  <!-- --------- -->
<el-descriptions title="学员资料" direction="vertical" :column="3" border >
  <el-descriptions-item label="SId">
    <span v-if="row">
      {{row.sId}}
    </span>
  </el-descriptions-item>
  <el-descriptions-item label="姓名">
    <span v-if="row">
      {{row.name}}
    </span>
    </el-descriptions-item>
  <el-descriptions-item label="年龄" :span="2">
    <span v-if="row">
      {{row.age}}
    </span>
  </el-descriptions-item>
  <el-descriptions-item label="班级">
    <span v-if="row">
      {{row.class}}
    </span>
  </el-descriptions-item>
  <el-descriptions-item label="学历">
    <span v-if="row">
      {{row.degree}}
    </span>
  </el-descriptions-item>
  <el-descriptions-item label="项目地址">
    <span v-if="row">
      {{row.productUrl}}
    </span>
  </el-descriptions-item>
  <el-descriptions-item label="描述">
    <span v-if="row">
      {{row.description}}
    </span>
  </el-descriptions-item>
  <el-descriptions-item label="城市">
    <span v-if="row">
      {{row.city}}
    </span>
  </el-descriptions-item>
  <el-descriptions-item label="创建时间">
    <span v-if="row">
      {{row.cTime}}
    </span>
  </el-descriptions-item>
</el-descriptions>

<!-- button -->
<button @click="returnlist">点击返回列表</button>

</div>
</template>

<script>
  // https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png
export default {
  meta:{
      title: 'xyzl',
      name:"学员资料",
      icon:"iconfont icon-shuju1"
    },
    data(){
      return{
        row:""
      }
    },
    methods:{
       returnlist(){
          this.$router.push("/studentManager/studentproduct")
       }
    },
    created(){
      // 获取query参数
      let {row} = this.$route.query
      console.log(row)
      this.row=row
    },
    computed:{
      imgUrl(){
        return this.row?.headimgurl ? this.row?.headimgurl : "https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"
      }
    }
}
</script>


<style scoped lang="less">
/deep/.el-descriptions__header{
    line-height:40px;
}
/deep/.el-avatar{
    height:200px;
    width:200px;
}
/deep/.el-avatar--circle{
    border-radius: 0%;
}
button{
    width:100px;
    height:40px;
    border-radius: 10%;
    border:none;
    background-color: cornflowerblue;
    color:white;
    margin-top:0;
}
</style>